<template>
    <el-upload action="#" :accept="accept" :show-file-list="false" :auto-upload="false" :on-change="uploadAction">
        <slot></slot>
    </el-upload>
</template>

<script setup lang="ts">
    import { ElMessage } from "element-plus";
    import { judgmentExtError, judgmentSizeError } from "@/components/globalUtils/UploadFile";
    import { _ossStore } from "@/store/config";

    const props = defineProps({
        // 选择文件类型 默认excel
        accept: {
            type: String,
            default: _ossStore.excelAccept,
        },
        // 判断文件类型 默认excel
        acceptRule: {
            type: String,
            default:  _ossStore.excelTypeRule,
        },
        // 文件大小
        size: {
            type: Number,
            default: 10
        },
    });
    const emit = defineEmits(['change']);
    // 上传文件
    const uploadAction = (option: ObjValueAny = {}) => {
        const { raw } = option;
        const _size: number = props.size as number;
        const sizeError: string = judgmentSizeError(raw, _size);
        if (sizeError) {
            ElMessage.error(sizeError);
            return;
        }
        const extError: string = judgmentExtError(raw, props.acceptRule as string);
        if (extError) {
            ElMessage.error(extError);
            return;
        }
        emit('change', raw);
    }
</script>

<style scoped>
    :deep(.el-upload) {
        width: 100%;
    }
</style>